<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://d3js.org/d3.v5.min.js"></script>
</head>

<body>

 
  <script>

    var width = 600;
    var height = 400;

   var svg = d3.select('body')
     .append('svg')
     .attr('width',width)
     .attr('height',height);

     svg.append('rect')
     .attr("fill","green")
     .attr("x",30)
     .attr("y",40)
     .attr("width",100)
     .attr("height",30)

     .transition()
     //持续时间
     .duration(2000)
     //过渡动画执行的延时的时间
     .delay(3000)

     .attr("width",300)
     .attr("height",300)
     .attr("x",200)
     .attr("y",100)
  </script>
</body>

</html>